<template>
    <div>
        <pagetitle type="2"></pagetitle>
        <el-card class="operatingrecord">
            <template #header>
                <div class="serchbox">
                    <div class="left">
                        <el-input v-model="input" class="serchs" placeholder="请输入文档名称" />
                        <el-button type="primary" text bg>搜索</el-button>
                    </div>
                    <el-button type="primary" text bg @click="opendialog('新增文档')">新增文档</el-button>
                </div>
            </template>
            <el-table :data="tableData" style="width: 100%">
                <el-table-column prop="name" label="文档标题"></el-table-column>
                <el-table-column label="发布时间"></el-table-column>
                <el-table-column label="操作人"></el-table-column>
                <el-table-column label="操作" width="100">
                    <template #default>
                        <el-button type="primary" size="small" link @click="opendialog('编辑文档')">编辑</el-button>
                        <el-button type="danger" size="small" link>删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <pagination :totalNum="60"></pagination>
        </el-card>
        <el-dialog v-model="dialogVisible" :title="dialogTitle" width="600px">
            <el-form :model="formInline" label-width="90px">
                <el-form-item label="文档标题">
                    <el-input v-model="formInline.name" placeholder="请输入文档标题" />
                </el-form-item>
                <!-- <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item label="封面图">
                            <uploadFile
                                :fileUrl="formInline.name"
                                @callBack="uploadFiles"
                                tableItem="cardHold"
                                width="64px"
                                height="64px"
                                :showText="false"
                                iconSize="18px"
                            ></uploadFile>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="是否推荐">
                            <el-switch v-model="formInline.name" active-color="#299c37"> </el-switch>
                        </el-form-item>
                    </el-col>
                </el-row> -->
                <el-form-item label="文档内容">
                    <el-input v-model="formInline.name" :rows="6" resize="none" type="textarea" placeholder="请输入文档内容" />

                    <!-- <editor class="inputs" height="220" /> -->
                </el-form-item>
                <el-form-item>
                    <el-button type="primary">确定</el-button>
                    <el-button @click="closedialog()">取消</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>
<script setup lang="ts">
import editor from "../components/editor.vue";
import { ref } from "vue";
import { useRouter } from "vue-router";
const router = useRouter();
const dialogVisible = ref(false);
const dialogTitle = ref("新增列表");
const formInline: any = {};
const input = ref("");
const opendialog = (t: string, type?: number | string | null) => {
    dialogTitle.value = t;
    dialogVisible.value = true;
};
const closedialog = () => {
    dialogVisible.value = false;
};
const uploadFiles = () => {};
const tableData = [
    {
        id: 3,
        date: "2016-05-01",
        name: "wangxiaohu",
        address: "No. 189, Grove St, Los Angeles",
    },
    {
        id: 4,
        date: "2016-05-03",
        name: "wangxiaohu",
        address: "No. 189, Grove St, Los Angeles",
    },
];
</script>
<style scoped lang="scss">
.operatingrecord {
    .serchbox {
        display: flex;
        justify-content: space-between;
        align-items: center;
        .left {
            display: flex;
            justify-content: flex-start;
            align-items: center;
            .serchs {
                width: 300px;
                margin-right: 20px;
            }
        }
    }
}
</style>
